import SplashCursor from '../../components/SplashCursor/SplashCursor'
import BlurText from '../../components/BlurText/blurText.jsx';
import CircularText from '../../components/CircularText/CircularText.jsx';

const UserCenter = () => {

    const handleAnimationComplete = () => {
        console.log('Animation completed!');
    };

    return (
        <div style={{ width: '400px', height: '600px', fontSize: '20px' }}>
            <SplashCursor />
            <BlurText
                text="Isn't this so cool?!"
                delay={150}
                animateBy="words"
                direction="top"
                onAnimationComplete={handleAnimationComplete}
                rootMargin="30px"
                className="text-2xl mb-8"
            />
            <CircularText
                text="REACT*BITS*COMPONENTS* 11111111111111"
                onHover="speedUp"
                spinDuration={20}
                className="custom-class"
                style={{ color: 'black'}}
            />
        </div>
    )
}

export default UserCenter